<div id="content">
  <div class="row s_page_title">
    <sa-big-breadcrumbs
      [items]="['系统基础管理', '公司管理', '维修方案管理']"
      icon="fa fa-list"
      class="col-xs-12 col-sm-7 col-md-7 col-lg-4"
    ></sa-big-breadcrumbs>
  </div>
  <sa-widgets-grid>
    <div class="s_table">
      <div sa-widget [editbutton]="false" color="darken" class="clearfix">
        <header>
          <span class="widget-icon"><i class="fa fa-table"></i></span>
          <h2>维修方案管理</h2>
        </header>
        <div>
          <div class="widget-body no-padding">
            <div class="page-header clearfix s_table_opreation">
              <div class="left page-header-btn" style="width: calc(100% - 230px)">
                <div class="top_module">
                  <span class="module_text">公司名称</span>
                  <sa-company-tree
                    companyTreeId="companyTree"
                    (companySelected)="companySelected($event)"
                  ></sa-company-tree>
                </div>

                <div class="top_module">
                  <span class="module_text">方案名称</span>
                  <div class="s_hover_box">
                    <select class="select2" id="repairPointSelect2">
                      <option value=""></option>
                    </select>
                    <div class="s_del_icon" (click)="delRepairPoint()">x</div>
                  </div>
                </div>

                <div class="top_module top_module_box">
                  <span class="top_module_label module_text">生效状态</span>
                  <select name="" class="top_module_select" [(ngModel)]="tableParam.status">
                    <option value="">全部</option>
                    <option value="1">已生效</option>
                    <option value="0">未生效</option>
                  </select>
                </div>

                <div class="top_module top_module_box">
                  <span class="top_module_label module_text">时间类型</span>
                  <select name="" class="top_module_select" [(ngModel)]="tableParam.sortBy">
                    <option value="">全部</option>
                    <option value="0">创建时间</option>
                    <option value="1">更新时间</option>
                  </select>
                </div>

                <div class="top_module top_module_box">
                  <span class="top_module_label module_text">排序</span>
                  <select name="" class="top_module_select" [(ngModel)]="tableParam.sortType">
                    <option value="0">升序</option>
                    <option value="1">降序</option>
                  </select>
                </div>
                <!--<div class="selectDate top_module">
									<table-select-date [notInit]='true' (outerTime)="getSelectTableTime($event)" ></table-select-date>
								</div>-->
                <button class="btn btn-primary" (click)="tableSearch()">查询</button>
                <button class="btn btn-primary" (click)="tableAdd(repairPointFromModal)">新增</button>
              </div>
              <!-- <div class="right top-search">
								<input type="text" [(ngModel)]="tableParam.searchKey" (change)="tableSearch()" class="search-input" placeholder="方案名称">
								<span class="top-search-box">
									<button class="top-search-btn" type="button" (click)="tableSearch()"> <i class="fa fa-search"></i></button>
								</span>
							</div> -->
            </div>
            <div class="table_scroll">
              <table
                class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
              >
                <thead>
                  <tr>
                    <th>方案编号</th>
                    <th>方案名称</th>
                    <th>方案配置</th>
                    <th>生效状态</th>
                    <th>创建人</th>
                    <th>创建时间</th>
                    <th>更新人</th>
                    <th>更新时间</th>
                    <th>操作</th>
                  </tr>
                </thead>
                <tbody>
                  <tr *ngFor="let row of tableData">
                    <td>{{ row.scenarioNumber }}</td>
                    <td>{{ row.scenarioName }}</td>
                    <td><button type="button" (click)="viewChanges(row, repairPointFromModal)">点击查看</button></td>
                    <td>
                      <span *ngIf="row.status == '0'">未生效</span>
                      <span *ngIf="row.status == '1'">已生效</span>
                    </td>
                    <td>{{ row.userNameForCreate }}</td>
                    <td>{{ row.createTime }}</td>
                    <td>{{ row.userNameForUpdate }}</td>
                    <td>{{ row.updateTime }}</td>
                    <td>
                      <button type="button" (click)="tableEdit(row, repairPointFromModal)">编辑</button>
                      <button type="button" (click)="changeRecord(row, repairLookModal)">变更记录</button>
                      <button type="button" (click)="tableDel(row)">删除</button>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
            <div class="table-fix clearfix">
              <paginator
                [totalRecords]="totalCount"
                [rows]="pageSize"
                [currentPage]="curPage - 1"
                (onPageChange)="paginate($event)"
              ></paginator>
              <button type="button" class="btn default refresh_btn" (click)="refresh()">
                <i class="fa fa-refresh"></i>
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </sa-widgets-grid>
  <!-- 维修方案新增   弹窗-->
  <section
    bsModal
    #repairPointFromModal="bs-modal"
    class="modal fade"
    tabindex="-1"
    role="dialog"
    aria-labelledby="myLargeModalLabel"
    aria-hidden="true"
  >
    <div class="modal-dialog modal-lg" style="width: 850px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="modalClose(repairPointFromModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">维修方案-{{ pageType }}</h4>
        </div>
        <form
          id="repairPointFrom"
          class="form-horizontal"
          role="form"
          novalidate="novalidate"
          [saBootstrapValidator]="validatorOptions"
        >
          <div class="modal-body">
            <div class="row form-horizontal">
              <div class="form-group col-xs-12 name">
                <label class="control-label col-xs-4 col-sm-2">
                  方案名称
                  <sup>*</sup>
                </label>
                <div class="col-xs-10">
                  <input
                    class="form-control"
                    name="scenarioName"
                    [attr.rowId]="repairPonitFrom.scenarioNumber"
                    [(ngModel)]="repairPonitFrom.scenarioName"
                    placeholder="维修方案"
                    [disabled]="pageType == '查看'"
                  />
                </div>
              </div>
              <table
                class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
              >
                <thead>
                  <tr>
                    <th>适用范围</th>
                    <th>生效状态</th>
                    <th>是否展示明细</th>
                    <th>是否需要审核</th>
                    <th>是否需要预约</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td class="form-group">
                      <sa-company-tree-checkbox
                        #companyTree
                        wrap="body"
                        companyTreeId="companyTreeFrom"
                        [Height]="32"
                        [companyValue]="repairPonitFrom.companyArrays"
                        (companySelected)="addCompanySelected($event)"
                        [hidden]="pageType == '查看'"
                      ></sa-company-tree-checkbox>
                      <input
                        class="form-control"
                        name="companyNames"
                        [(ngModel)]="companyNames"
                        disabled
                        *ngIf="pageType == '查看'"
                      />
                    </td>
                    <td class="form-group" style="width: 70px">
                      <div class="clearfix">
                        <select
                          class="form-control"
                          name="status"
                          [(ngModel)]="repairPonitFrom.status"
                          [disabled]="pageType == '查看'"
                        >
                          <option value="1" selected>是</option>
                          <option value="0">否</option>
                        </select>
                      </div>
                    </td>
                    <td class="form-group" style="width: 80px">
                      <div class="clearfix">
                        <select
                          class="form-control"
                          name="showDetail"
                          [(ngModel)]="repairPonitFrom.showDetail"
                          [disabled]="pageType == '查看'"
                          (change)="showDetailChange($event.target.value)"
                        >
                          <option value="1" selected>展示</option>
                          <option value="0">隐藏</option>
                        </select>
                      </div>
                    </td>
                    <td class="form-group" style="width: 90px">
                      <div class="clearfix">
                        <select
                          class="form-control"
                          name="needCheck"
                          [(ngModel)]="repairPonitFrom.needCheck"
                          [disabled]="pageType == '查看'"
                          (change)="needCheckChange($event.target.value)"
                        >
                          <option value="1" selected>需要</option>
                          <option value="0">不需要</option>
                        </select>
                      </div>
                    </td>
                    <td class="form-group" style="width: 90px">
                      <div class="clearfix">
                        <select
                          class="form-control"
                          name="needAppointment"
                          [(ngModel)]="repairPonitFrom.needAppointment"
                          [disabled]="pageType == '查看'"
                          (change)="needAppointmentChange($event.target.value)"
                        >
                          <option value="1">需要</option>
                          <option value="0" selected>不需要</option>
                        </select>
                      </div>
                    </td>
                  </tr>
                  <tr style="height: 50px">
                    <td colspan="5">
                      <div class="col-xs-12">
                        <label class="control-label col-xs-4 col-sm-2" style="text-align: left; padding-left: 0">
                          支付方式
                          <sup>*</sup>
                        </label>
                        <div class="col-xs-10">
                          <label class="radio radio-inline" style="margin-right: 40px">
                            <input
                              type="radio"
                              class="radiobox"
                              checked
                              [(ngModel)]="repairPonitFrom.payWay"
                              (change)="lockStatusChange($event.target.value)"
                              value="0"
                              name="payWay"
                              [disabled]="pageType == '查看'"
                            />
                            <span>个人转账</span>
                          </label>
                          <label class="radio radio-inline" style="margin-right: 40px">
                            <input
                              type="radio"
                              class="radiobox"
                              [(ngModel)]="repairPonitFrom.payWay"
                              (change)="lockStatusChange($event.target.value)"
                              value="1"
                              name="payWay"
                              [disabled]="pageType == '查看'"
                            />
                            <span>个人转账+对公转账</span>
                          </label>
                        </div>
                      </div>
                    </td>
                  </tr>
                </tbody>
              </table>

              <table
                class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
                style="margin-top: 20px !important"
              >
                <thead>
                  <tr>
                    <th>费用类型</th>
                    <th>启用状态</th>
                    <th>费用明细</th>
                    <th>价格</th>
                    <th>是否支持累加</th>
                    <th>是否支持减免</th>
                    <th>减免后价格</th>
                  </tr>
                </thead>
                <tbody>
                  <tr
                    *ngFor="let item of repairPlansAttr"
                    class="repairPlans"
                    [ngClass]="{ repairPlansDis: pageType == '查看' }"
                  >
                    <td
                      *ngIf="
                        (item.typeCost === '移机' && item.index === '1') ||
                        (item.typeCost === '加挂' && item.index === '9')
                      "
                      rowspan="2"
                      style="vertical-align: middle"
                    >
                      {{ item.typeCost }}
                    </td>
                    <td *ngIf="item.typeCost != '设备维护' && item.typeCost != '移机' && item.typeCost != '加挂'">
                      {{ item.typeCost }}
                    </td>
                    <td
                      *ngIf="item.typeCost == '设备维护' && item.index == '3'"
                      rowspan="5"
                      style="vertical-align: middle"
                    >
                      {{ item.typeCost }}
                    </td>
                    <td class="smart-form" style="padding: 7px 10px; text-align: center">
                      <input
                        style="margin-right: 5px; display: none"
                        name="enabled"
                        class="isStatus"
                        type="checkbox"
                        [checked]="item.enabled"
                        [attr.key]="'enabled' + item.index"
                        *ngIf="pageType != '查看'"
                      />
                      <input
                        style="margin-right: 5px; display: none"
                        name="enabled"
                        class="isStatus"
                        type="checkbox"
                        [checked]="item.enabled"
                        [attr.key]="'enabled' + item.index"
                        disabled
                        *ngIf="pageType == '查看'"
                      />
                    </td>
                    <!-- <td>{{item.enabled}}</td> -->
                    <td>{{ item.costDetail }}</td>
                    <td class="form-group tableGroup addInputWrap">
                      <input
                        class="form-control tableInput"
                        [name]="'price' + item.index"
                        type="number"
                        [(ngModel)]="item.price"
                        [attr.rowId]="'price' + item.index"
                        *ngIf="pageType != '查看' && item.enabled == 1"
                        (change)="priceChange($event.target.value, item.index)"
                      />
                      <input
                        class="form-control tableInput"
                        [name]="'price' + item.index"
                        type="number"
                        [(ngModel)]="item.price"
                        [attr.rowId]="'price' + item.index"
                        *ngIf="pageType == '查看' || item.enabled != 1"
                        disabled
                      />
                      <span>
                        元
                        <span *ngIf="item.unit">/</span>
                        {{ item.unit }}
                      </span>
                    </td>
                    <td
                      class="smart-form"
                      style="padding: 7px 10px; text-align: center"
                      *ngIf="pageType != '查看' && item.enabled == 1"
                    >
                      <input
                        style="margin-right: 5px; display: none"
                        name="restrict"
                        class="isStatus"
                        type="checkbox"
                        [checked]="item.restrict"
                        [attr.key]="'restrict' + item.index"
                      />
                    </td>
                    <td
                      class="smart-form"
                      style="padding: 7px 10px; text-align: center"
                      *ngIf="pageType == '查看' || item.enabled != 1"
                    >
                      <input
                        style="margin-right: 5px; display: none"
                        name="restrict"
                        class="isStatus"
                        type="checkbox"
                        [checked]="item.restrict"
                        [attr.key]="'restrict' + item.index"
                        disabled
                      />
                    </td>
                    <td
                      class="smart-form"
                      style="padding: 7px 10px; text-align: center"
                      *ngIf="pageType != '查看' && item.enabled == 1"
                    >
                      <input
                        style="margin-right: 5px; display: none"
                        name="discount"
                        class="isStatus"
                        type="checkbox"
                        [checked]="item.discount"
                        [attr.key]="'discount' + item.index"
                      />
                    </td>
                    <td
                      class="smart-form"
                      style="padding: 7px 10px; text-align: center"
                      *ngIf="pageType == '查看' || item.enabled != 1"
                    >
                      <input
                        style="margin-right: 5px; display: none"
                        name="discount"
                        class="isStatus"
                        type="checkbox"
                        [checked]="item.discount"
                        [attr.key]="'discount' + item.index"
                        disabled
                      />
                    </td>
                    <!-- <td>{{item.discount}}</td> -->
                    <td class="form-group tableGroup" style="padding-right: 37px">
                      <input
                        class="form-control tableInput"
                        [name]="'discountPrice' + item.index"
                        type="number"
                        [(ngModel)]="item.discountPrice"
                        [attr.rowId]="'discountPrice' + item.index"
                        *ngIf="pageType != '查看' && item.enabled == 1 && item.discount == 1"
                        (change)="discountPriceChange($event.target.value, item.index)"
                        style="width: 100px"
                      />
                      <input
                        class="form-control tableInput"
                        [name]="'discountPrice' + item.index"
                        type="number"
                        [(ngModel)]="item.discountPrice"
                        [attr.rowId]="'discountPrice' + item.index"
                        *ngIf="pageType == '查看' || item.enabled != 1 || item.discount != 1"
                        disabled
                        style="width: 100px"
                      />
                      <span>
                        元
                        <span *ngIf="item.unit">/</span>
                        {{ item.unit }}
                      </span>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
          <div class="modal-footer" *ngIf="pageType != '查看'">
            <button type="button" class="btn btn-default" (click)="modalClose(repairPointFromModal)">取消</button>
            <button type="button" class="btn btn-primary" (click)="repairPointSubmit(repairPointFromModal)">
              提交
            </button>
          </div>
        </form>
      </div>
    </div>
  </section>
  <!-- 维修方案新增 弹窗end-->

  <!-- 变更记录   弹窗-->
  <section
    bsModal
    #repairLookModal="bs-modal"
    class="modal fade"
    tabindex="-1"
    role="dialog"
    aria-labelledby="myLargeModalLabel"
    aria-hidden="true"
  >
    <div class="modal-dialog modal-lg" style="width: 1270px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="modalLookClose(repairLookModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">变更记录</h4>
        </div>
        <div class="modal-body">
          <div class="row form-horizontal">
            <table
              class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
            >
              <thead>
                <tr>
                  <th>账户名称</th>
                  <th>操作</th>
                  <th>变更后内容</th>
                  <th>操作时间</th>
                </tr>
              </thead>
              <tbody>
                <tr *ngFor="let row of RecordList">
                  <td style="vertical-align: middle">{{ row.userName }}</td>
                  <td style="vertical-align: middle">
                    <span *ngIf="row.operationType == '0'">新建</span>
                    <span *ngIf="row.operationType == '1'">编辑</span>
                  </td>
                  <td class="form-group">
                    <div class="form-group col-xs-12 name">
                      <label class="control-label col-xs-4 col-sm-2">
                        方案名称
                        <sup>*</sup>
                      </label>
                      <div class="col-xs-10">
                        <input
                          class="form-control"
                          name="scenarioName"
                          [attr.rowId]="row.scenarioNumber"
                          [(ngModel)]="row.scenarioName"
                          placeholder="维修方案"
                          disabled
                        />
                      </div>
                    </div>
                    <table
                      class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
                    >
                      <thead>
                        <tr>
                          <th>适用范围</th>
                          <th>生效状态</th>
                          <th>是否展示明细</th>
                          <th>是否需要审核</th>
                          <th>是否需要预约</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <td class="form-group">
                            <input
                              class="form-control"
                              name="companyNameAttr"
                              [(ngModel)]="row.companyNameAttr"
                              disabled
                            />
                          </td>
                          <td class="form-group">
                            <div class="clearfix">
                              <select class="form-control" name="status" [(ngModel)]="row.status" disabled>
                                <option value="1" selected>是</option>
                                <option value="0">否</option>
                              </select>
                            </div>
                          </td>
                          <td class="form-group">
                            <div class="clearfix">
                              <select class="form-control" name="showDetail" [(ngModel)]="row.showDetail" disabled>
                                <option value="1" selected>展示</option>
                                <option value="0">隐藏</option>
                              </select>
                            </div>
                          </td>
                          <td class="form-group">
                            <div class="clearfix">
                              <select class="form-control" name="needCheck" [(ngModel)]="row.needCheck" disabled>
                                <option value="1" selected>需要</option>
                                <option value="0">不需要</option>
                              </select>
                            </div>
                          </td>
                          <td class="form-group">
                            <div class="clearfix">
                              <select
                                class="form-control"
                                name="needAppointment"
                                [(ngModel)]="row.needAppointment"
                                disabled
                              >
                                <option value="1">需要</option>
                                <option value="0" selected>不需要</option>
                              </select>
                            </div>
                          </td>
                        </tr>
                        <tr style="height: 50px">
                          <td colspan="4">
                            <div class="col-xs-12">
                              <label class="control-label col-xs-4 col-sm-2" style="text-align: left; padding-left: 0">
                                支付方式
                                <sup>*</sup>
                              </label>
                              <div class="col-xs-10">
                                <label class="radio radio-inline" style="margin-right: 40px">
                                  <input
                                    type="radio"
                                    class="radiobox"
                                    checked
                                    [(ngModel)]="row.payWay"
                                    disabled
                                    value="0"
                                    name="payWay"
                                  />
                                  <span>个人转账</span>
                                </label>
                                <label class="radio radio-inline" style="margin-right: 40px">
                                  <input
                                    type="radio"
                                    class="radiobox"
                                    [(ngModel)]="row.payWay"
                                    disabled
                                    value="1"
                                    name="payWay"
                                  />
                                  <span>个人转账+对公转账</span>
                                </label>
                              </div>
                            </div>
                          </td>
                        </tr>
                      </tbody>
                    </table>

                    <table
                      class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
                      style="margin-top: 20px !important"
                    >
                      <thead>
                        <tr>
                          <th>费用类型</th>
                          <th>启用状态</th>
                          <th>费用明细</th>
                          <th>价格</th>
                          <th>是否支持累加</th>
                          <th>是否支持减免</th>
                          <th>减免后价格</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr *ngFor="let item of row.repairPlans" class="repairPlans">
                          <td
                            *ngIf="
                              (item.typeCost === '移机' && item.index === '1') ||
                              (item.typeCost === '加挂' && item.index === '9')
                            "
                            rowspan="2"
                            style="vertical-align: middle"
                          >
                            {{ item.typeCost }}
                          </td>
                          <td *ngIf="item.typeCost != '设备维护' && item.typeCost != '移机' && item.typeCost != '加挂'">
                            {{ item.typeCost }}
                          </td>
                          <td
                            *ngIf="item.typeCost == '设备维护' && item.index == '3'"
                            rowspan="5"
                            style="vertical-align: middle"
                          >
                            {{ item.typeCost }}
                          </td>
                          <td class="smart-form" style="height: 28px; line-height: 28px; text-align: center">
                            <div class="mySwitch" *ngIf="!item.enabled">
                              <span class="white"></span>
                              <span class="closeText">关闭</span>
                            </div>
                            <div class="mySwitch" *ngIf="item.enabled">
                              <span class="openText">开启</span>
                              <span class="white"></span>
                            </div>
                            <!-- <input  style="margin-right: 5px;display: none;" name="enabled" class="isStatus" type="checkbox"  [checked]="item.enabled" [attr.key]="'enabled'+item.index" disabled> -->
                          </td>
                          <!-- <td>{{item.enabled}}</td> -->
                          <td>{{ item.costDetail }}</td>
                          <td class="form-group tableGroup" style="padding-right: 37px">
                            <input
                              class="form-control tableInput"
                              style="width: 100px"
                              [name]="'price' + item.index"
                              type="number"
                              [(ngModel)]="item.price"
                              [attr.rowId]="'price' + item.index"
                              disabled
                            />
                            <span>
                              元
                              <span *ngIf="item.unit">/</span>
                              {{ item.unit }}
                            </span>
                          </td>
                          <td class="smart-form" style="height: 28px; line-height: 28px; text-align: center">
                            <div class="mySwitch" *ngIf="!item.restrict">
                              <span class="white"></span>
                              <span class="closeText">关闭</span>
                            </div>
                            <div class="mySwitch" *ngIf="item.restrict">
                              <span class="openText">开启</span>
                              <span class="white"></span>
                            </div>
                            <!-- <input  style="margin-right: 5px;display: none;" name="restrict" class="isStatus" type="checkbox"  [checked]="item.restrict" [attr.key]="'restrict'+item.index" disabled> -->
                          </td>
                          <td class="smart-form" style="height: 28px; line-height: 28px; text-align: center">
                            <div class="mySwitch" *ngIf="!item.discount">
                              <span class="white"></span>
                              <span class="closeText">关闭</span>
                            </div>
                            <div class="mySwitch" *ngIf="item.discount">
                              <span class="openText">开启</span>
                              <span class="white"></span>
                            </div>
                            <!-- <input  style="margin-right: 5px;display: none;" name="discount" class="isStatus" type="checkbox"  [checked]="item.discount" [attr.key]="'discount'+item.index" disabled> -->
                          </td>
                          <!-- <td>{{item.discount}}</td> -->
                          <td class="form-group tableGroup" style="padding-right: 37px">
                            <input
                              class="form-control tableInput"
                              [name]="'discountPrice' + item.index"
                              type="number"
                              [(ngModel)]="item.discountPrice"
                              [attr.rowId]="'discountPrice' + item.index"
                              disabled
                              style="width: 100px"
                            />
                            <span>
                              元
                              <span *ngIf="item.unit">/</span>
                              {{ item.unit }}
                            </span>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </td>
                  <td style="vertical-align: middle">{{ row.operationTime }}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- 维修方案新增 弹窗end-->
</div>
